<template>
  <a-spin :spinning="confirmLoading" style="height:100%;">
    <a-upload-dragger
      :multiple="false"
      :accept="accept"
      :fileList="fileListData"
      :remove="handleRemove"
      :beforeUpload="beforeUpload"
    >
      <p class="ant-upload-drag-icon">
        <a-icon type="inbox" />
      </p>
      <p class="ant-upload-text">点击或将文件拖拽到这里上传</p>
      <p class="ant-upload-hint">支持扩展名：{{ accept }}</p>

      <!--      <a @click="handleModal">下载数据模板</a>-->
    </a-upload-dragger>
    <div>
      <!-- <a-button class="back" size="small" @click="handleCancel"> 取消 </a-button> -->
      <!--      <a-button class="submit" size="small" type="primary" @click="handleOk"> 开始导入 </a-button>-->
      <a @click="getexcel">下载导入模板</a>
    </div>

  </a-spin>
</template>

<script>
// import { importExcel, exportWpTemplate } from '@/api/alarm.js'
import { updataIon, getexcel, getTemplet, getQKexcel, updataCom } from '@/api/xlgc/ComprehensiveBusiness'
import { getMAMBexcel, updataMAexcel } from '@api/xlgc/lawCase'
export default {
  // props: {
  //   parentarr: {
  //     type: Array,
  //     default() {
  //       return []
  //     },
  //   },
  //   modalType: {
  //     type: String,
  //     default: '',
  //   },
  // },
  data() {
    return {
      title: '',
      width: 800,
      disableSubmit: false,
      result: {},
      confirmLoading: false,
      fileListData: [],
      accept: '.xls,.xlsx' // 导入的文件格式
    }
  },
  created() {},
  computed: {
    isDisabled() {
      return !(this.fileListData.length > 0)
    }
  },
  methods: {
    downLoadMix(res, fileName) {
      let blob = new Blob([res]) // res为从后台返回的数据
      if (!fileName) {
        fileName = res.headers['content-disposition'].split('filename=').pop()
      }
      if ('msSaveOrOpenBlob' in navigator) {
        window.navigator.msSaveOrOpenBlob(blob, fileName)
      } else {
        const elink = document.createElement('a')
        elink.download = fileName
        elink.style.display = 'none'
        elink.href = URL.createObjectURL(blob)
        document.body.appendChild(elink)
        elink.click()
        URL.revokeObjectURL(elink.href)
        document.body.removeChild(elink)
      }
    },
    getexcel() {
      getQKexcel().then(response => {
        console.log(response)
        window.location.href = response.message
      }).catch(error => {
        console.log(error)
      })
    },

    close() {
      this.$emit('close')
    },
    handleOk() {
      const { fileListData } = this
      if (fileListData && fileListData.length === 0) {
        this.$message.error('请选择导入文件')
        return
      }
      const formData = new FormData()
      fileListData.forEach(file => {
        formData.append('files', file)
      })
      this.confirmLoading = true
      updataCom(formData)
        .then(res => {
          console.log(res)
          if (res.success) {
            this.fileListData = []
            this.confirmLoading = false
            this.$message.success(res.message, 2)
            this.showConfirm(res.result)
            this.$emit('warn', res)
          } else {
            this.$emit('warn', res)
            this.confirmLoading = false
            this.$message.error(res.message)
          }
        })
        .catch(e => {
          this.confirmLoading = false
          this.$message.error('导入出错了')
        })
    },
    showConfirm(result) {
      this.$emit('importData', result)
    },
    handleCancel() {
      this.fileListData = []
      // this.close()
    },
    handleModal() {
      getexcel().then(res => {
        if (res && res.size > 0) {
          const fileName = '数据模板.xls'
          this.downLoadMix(res, fileName)
        } else {
          this.$message.warn('模板不存在！')
        }
      })
    },
    // 上传前拦截
    beforeUpload(file) {
      // console.log('12121212')
      this.fileListData = [file] // [...this.fileListData, file];
      return false
    },
    // 移除
    handleRemove(file) {
      const index = this.fileListData.indexOf(file)
      const newFileList = this.fileListData.slice()
      newFileList.splice(index, 1)
      this.fileListData = newFileList
    }
  }
}
</script>

<style scoped lang="less">
/deep/.ant-spin-container {
  height: 100%;
  .ant-upload.ant-upload-drag {
    height: 85%;
  }
}
/deep/.ant-upload-matter {
  position: absolute;
  bottom: 84px;
  right: 5px;
  padding: 30px 0 0;
  p {
    margin-bottom: 0;
    font-size: 12px;
  }
}
.footer-model {
  position: absolute;
  bottom: 84px;
  left: 10px;
}
.importBox {
  position: absolute;
  bottom: 10px;
  left: 10px;
  z-index: 100;
  // .submit {
  //   margin-left: 10px;
  // }
}
</style>
